import PropTypes from 'prop-types';
import PureRenderMixin from "react-addons-pure-render-mixin"
import React, {PureComponent} from 'react';

import T from 'utils/T';

import Carousel from './carousel';
import './index.scss';

import img1 from './img/1.png';
import img2 from './img/1.png';
import img3 from './img/1.png';

@T.decorator.propTypes({
    data: PropTypes.array,
    options: PropTypes.object
})
export default class Carousel3d extends PureComponent {

    constructor(props) {
        super(props);
        this.chart = null;
    }

    componentDidMount() {
        this.isDraw();
    }

    isDraw(){
        if(this.carouselBox){
            this.drawCarousel();
        }
    }

    drawCarousel(){

        const self  = this;
        this.Carousel = new Carousel($(self.carouselBox), {
            curDisplay: 0,
            autoPlay: true,
            interval: 2000,
            data: [
                {
                    "imgUrl": "http://meteorology-industry-dev.tianjishuju.com/static/img/upload_6daa8351fbecd7af2d7ee0c3d71a5f14.jpg",
                    "name": "吴迪",
                    "list": ""
                },
                {
                    "imgUrl": "http://meteorology-industry-dev.tianjishuju.com/static/img/upload_2727d30e2dfdad39569260654337f183.jpg",
                    "name": "李雪",
                    "list": ""
                },
                {
                    "imgUrl": "http://meteorology-industry-dev.tianjishuju.com/static/img/upload_63e9960de29443497ceb765680be626e.jpg",
                    "name": "徐鹏",
                    "list": ""
                },
                {
                    "imgUrl": "http://meteorology-industry-dev.tianjishuju.com/static/img/upload_bd600d5090b171d4e46f4fc109b0b7ce.jpg",
                    "name": "刘海波",
                    "list": ""
                },
                {
                    "imgUrl": "http://meteorology-industry-dev.tianjishuju.com/static/img/upload_7d6046807c220d19411667bb99ee7efd.jpg",
                    "name": "王艺",
                    "list": ""
                },
                {
                    "imgUrl": "http://meteorology-industry-dev.tianjishuju.com/static/img/upload_124dbcb0816525c0972f80ca9b5ca1f1.jpg",
                    "name": "孙凡迪",
                    "list": ""
                },
                {
                    "imgUrl": "http://meteorology-industry-dev.tianjishuju.com/static/img/upload_0dcba348a7923c39ab8e65c2cd4d1579.jpg",
                    "name": "孔德俏",
                    "list": ""
                },
                {
                    "imgUrl": "http://meteorology-industry-dev.tianjishuju.com/static/img/upload_588e45ad4e96ce8e4baf87f1a548b9fb.jpg",
                    "name": "王玮玮",
                    "list": ""
                },
                {
                    "imgUrl": "http://meteorology-industry-dev.tianjishuju.com/static/img/upload_bfd97514b0678f7c6aa72f850b2a61fb.jpg",
                    "name": "于梦然",
                    "list": ""
                },
                {
                    "imgUrl": "http://meteorology-industry-dev.tianjishuju.com/static/img/upload_ab2e660525127d548c45e428d4999543.jpg",
                    "name": "潘一可",
                    "list": ""
                },
                {
                    "imgUrl": "http://meteorology-industry-dev.tianjishuju.com/static/img/upload_f6f0250be5231b2321e9a44dc27de31a.jpg",
                    "name": "孙瑜遥",
                    "list": ""
                },
                {
                    "imgUrl": "http://meteorology-industry-dev.tianjishuju.com/static/img/upload_de8c073758a72830773107b6def7b851.jpg",
                    "name": "潘宝儿",
                    "list": ""
                }
            ]
        });


    }

    componentWillUnmount() {
        clearInterval(this.Carousel.timer);
    }

    render() {

        return (
            <div className="carousel3d_bbox" ref={carouselBox => (this.carouselBox = carouselBox)}>
            </div>
        )
    }
}
